<script setup lang="js">
import {ref,computed} from "vue";

var ipbg = ref(true);

var background = computed(()=>({
  backgroundColor: ipbg.value ? 'yellow' : 'blue',
  padding: '20px',
}));

function changeBackground(){
  ipbg.value = !ipbg.value;
}
</script>

<template>
  <button @click="changeBackground">切换背景</button>
  <div :style="background" class="content">背景切换。</div>
</template>
<style scoped>
.content {
  width: 200px;
  margin: 20px auto;
  line-height: 100px;
  text-align: center;
}
</style>
